<?php
    $dir="/Applications/MAMP/htdocs/cedar";  //项目绝对路径 例如 c:/a/b (Windows)  /Applications/a/b (MacOS)  
    $projectName="米券API文档";  //项目名称 显示在左上角
    // $base="http://localhost:8888/cedar/public";    //api base 地址
    $base="http://106.12.197.216/rice/api";    //api base 地址
    $dir=str_replace('\\',DIRECTORY_SEPARATOR,$dir);
?>
 <?php  
                
                class api{

                    public function complie($filePath){
                     
                        $fileData=[];

                        $file=fopen($filePath,'r');
                        if(filesize($filePath)<=0) return false;
                        $string=fread($file,filesize($filePath));
                        

                        if(empty($string)) return $fileData;
                      

                        $arr=preg_match_all ('/\/\*\*([\s\S]+)\*\//U',$string,$regexp);
                        
                        if(empty($regexp[1]))
                        { 
                            return $fileData;
                        }
                        
                       
                        foreach ($regexp[1] as $key => $value) {
                           

                            $arr=preg_split('/\*/',$value);
                            $newArr=['params'=>[],'return'=>[],'plus'=>[]];
                            
                            if(empty($arr)) return $fileData;


                            foreach($arr as $item){

                                if($item){
                                    
                                    $itemArr=preg_split('/\s+/',trim($item));
                                    foreach($itemArr as $k=>$v){
                                        //apiName
                                        $length=count($itemArr);
                                        if($length===1){
                                            $newArr['apiName']=$v;
                                        }
                                        //url
                                        if($length===2&&$itemArr[0]==='@url'&&$k===0){
                                            $newArr['url']=$itemArr[1];
                                        }
                                        //method
                                        if($length===2&&$itemArr[0]==='@methods'&&$k===0){
                                            $newArr['methods']=$itemArr[1];
                                        }
                                        //plus
                                        if($length>=4&&$itemArr[0]==='@plus'&&$k===0){
                                            array_push($newArr['plus'],[
                                                'type'=>$itemArr[1],
                                                'name'=>preg_replace('/\$/','',$itemArr[2]),
                                                'msg'=>$itemArr[3],
                                                'default'=>isset($itemArr[4])?$itemArr[4]:'',
                                            ]);
                                        }
                                        //params
                                        if($length>=4&&$itemArr[0]==='@param'&&$k===0){
                                            array_push($newArr['params'],[
                                                'type'=>$itemArr[1],
                                                'name'=>preg_replace('/\$/','',$itemArr[2]),
                                                'msg'=>$itemArr[3],
                                                'default'=>isset($itemArr[4])?$itemArr[4]:'',
                                            ]);
                                        }
                                        //return
                                        if($length===3&&$itemArr[0]==='@return'&&$k===0){
                                            array_push($newArr['return'],[
                                                'name'=>preg_replace('/\$/','',$itemArr[1]),
                                                'msg'=>$itemArr[2],
                                            ]);
                                        }
                                    }
                                }
                            }
                            if(isset($newArr['methods'])&&!empty($newArr['methods'])){
                                array_push($fileData,$newArr);
                            }
                           
                        }
                        // print_r($fileData);
                        fclose($file);
                       
                        return $fileData;
                    }
                }
                $arrAll=[];
                function getAllFile($path){
                    GLOBAL $arrAll;
                    $api=new api();
                    $handler = opendir($path);
                    while( ($filename = readdir($handler)) !== false ) 
                        {   

                        if($filename != "." && $filename != "..")
                            {  
                             
                                if(is_dir($path.DIRECTORY_SEPARATOR.$filename)){
                                    $arrAll=getAllFile($path.DIRECTORY_SEPARATOR.$filename,$arrAll);
                                }else{
                                    $resData=$api->complie($path.DIRECTORY_SEPARATOR.$filename);
                                    if(!empty($resData)){
                                        $arrAll[$filename]=$resData;
                                    }
                                }
                            }
                        }
                    closedir($handler);
                    return $arrAll;
                }
                $arrAll=getAllFile($dir);
                
                
                
            ?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- <link rel="stylesheet" href="style.css"> -->
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <link rel="stylesheet" href="https://cdn.bootcss.com/highlight.js/9.13.1/styles/dracula.min.css">
    <script src="https://cdn.bootcss.com/highlight.js/9.13.1/highlight.min.js"></script>
    <script src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.min.js"></script>
    <link href="https://cdn.bootcss.com/toastr.js/latest/css/toastr.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/toastr.js/latest/js/toastr.min.js"></script>
    <style>

html,
body {
    height: 100%;
    overflow: hidden;
}

* {
    margin: 0;
    padding: 0;
    font-family: "微软雅黑";
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
}

#navigation {
    background: #fafafa;
    position: fixed;
    height: 100%;
    top: 0;
    left: 0;
    width: 15%;
    z-index: 99;
    border-right: 1px solid #e8e8e8;
}

#navigation>ul {
    background: #fafafa;
    height: 95%;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: auto;
}

#content {
    padding-left: 15%;
    height: 100%;
    display: table;
    width: 85%;
    position: relative;
    table-layout:fixed;word-break:break-all;
}

.clearfix::before {
    display: block;
    clear: both;
    content: "";
}

#content #left {
    background: #fff;
    height: 100%;
    width: 30%;
    display: table-cell;
    box-sizing: border-box;
    padding-left: 20px;
    position: relative;
    height: 100%;
}

#content #right {
    background: #fff;
    height: 100%;
    display: table-cell;
    width: 30%;
    position: relative;
    border-left: 1px solid #ddd;
}

#content #right2 {
    background: #fff;
    height: 100%;
    display: table-cell;
    width: 40%;
    position: relative;
    border-left: 1px solid #ddd;
    overflow:auto;
}
#content #right2>div{
    position:absolute;
    left:0;top:0;
    height:100%;width:100%;
    box-sizing:border-box;
    padding:20px;
    padding-top:100px;
}

#right .abs {
    height: 100%;
    top: 0;
    right: 0;
    width: 100%;
    padding: 30px;
    box-sizing: border-box;
    overflow: auto;
    padding-top: 70px;
}

#navigation li li {
    width: 90%;
    margin-left: 10%;
    font-size: 16px;
}

#navigation li a {
    min-height: 45px;
    line-height: 45px;
    color: #38424a;
    display: block;
    text-indent: 15px;
    font-size: 14px;
}

.active {
    color: #339cfb !important;
}

#search {
    width: 100%;
    height: 5%;
    border: 0;
    outline: none;
    text-indent: 15px;
    font-size: 16px;
}

#title {
    position: relative;
    z-index: 100;
    height: 5%;
    line-height: 50px;
    padding-left: 15px;
    border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
}

.apis {
    box-sizing: border-box;
    padding: 30px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: auto;
    width: 100%;
    padding-top: 70px;
}

.apis h1 {
    font-weight: lighter;
    color: #38424a;
    margin-bottom: 15px;
    margin-top: 15px;
}

.apis h2 {
    font-size: 14px;
    color: #666;
    font-weight: normal;
    margin-bottom: 20px;
}

.apis h3 {
    font-size: 16px;
    color: #333;
    font-weight: normal;
    margin-bottom: 10px;
}

.method {
    background: #333;
    color: #fff;
    min-width: 40px;
    text-align: center;
    padding: 5px 10px;
    border-radius: 30px;
    margin-right: 10px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    display: inline-block;
}

.POST {
    background: #38f !important;
}

.GET {
    background: #3c3 !important;
}

.PUT {
    background: #1ae4c0 !important;
}

.DELETE {
    background: red !important;
}

.apis>li {
    border-bottom: 2px solid #eee;
    background: #fff;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 20px;
    box-shadow: 0 0 5px #ddd;
    margin-bottom: 50px;
}

.copy {
    float: right;
    background: #eee;
    color: #fff;
    padding: 5px 10px;
    border-radius: 30px;
    margin-right: 10px;
    font-weight: bold;
    font-size: 12px;
    cursor: pointer;
    transition: 0.5s ease;
}

.ajax {
    float: right;
    background: #eee;
    color: #fff;
    padding: 5px 10px;
    border-radius: 30px;
    margin-right: 10px;
    font-weight: bold;
    font-size: 12px;
    cursor: pointer;
    transition: 0.5s ease;
}

.ajax:hover {
    background: #ff7100;
}

.copy:hover {
    background: #666;
}

.down:active {
    user-select: none;
    transform: scale(0.7, 0.7);
}

.apis table {
    width: 100%;
    margin: 20px 0;
    border: 1px solid #ddd;
    border-collapse: collapse;
    border-radius: 10px;
}

.apis tr {
    font-weight: bold;
    color: #38424a;
}

.apis td {
    background: #f8f8f8;
    padding: 10px;
    border-bottom: 1px solid #ddd;
    text-align: center;
    font-size: 14px;
}

.apis td input {
    width: 100%;
    height: 35px;
    border-radius: 5px;
    border: 0;
    border: 1px solid #ddd;
    padding-left: 10px;
}

.apis tr td:first-child {
    text-align: right;
}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
    width: 3px;
    height: 3px;
    background-color: #F5F5F5;
}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #F5F5F5;
}

/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc;
}

#header {
    position: absolute;
    width: 85%;
    right: 0;
    top: 0;
    height: 60px;
    background: #fff;
    z-index: 999;
    border-bottom: 1px solid #ddd;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0 30px;
}

.optable td {
    transition: 0.5s ease;
}

.optable:hover td {
    opacity: 1 !important;
}
#black{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    display: none;
    background:rgba(0, 0, 0, 0.5);
}
#help {
    position: absolute;
    z-index: 1001;
    top: 0;
    left: 50%;
    margin-left: -400px;
    width: 800px;
    height: 100%;
    background: #ffffff;
    display: none;
}
#helpBtn{
    font-size: 14px;
    color:#38f;
}
</style>
</head>
<body>
        <?php
            $count=0;
            foreach($arrAll as $item){
                foreach ($item as $itemm) {
                    $count++;
                }
            }
        ?>
        <div id="black"></div>
        <div id="help">
            <pre><code style="line-height:30px;">
                    / **
                    * 登录
                    * @url /user/login
                    * @methods GET
                    * @param integer $page 页数 10
                    * @param integer $time 日期 
                    * @return  $listData 列表数据
                    * @plus  integer $aaaaaaaaa 每页个数
                    * /
                </code></pre>
                <br>
            <ul style="line-height:30px;padding:20px;">
                <h2>打开本文件 修改顶部变量</h2>
                <h3>$dir="/Applications/MAMP/htdocs/cedar/app"; //项目的绝对路径</h3>
                <h3>$projectName="米券API文档";  //项目名称 显示在左上角</h3>
                <h3>$base="http://192.168.1.7/rice/api";    //api测试请求的地址</h3>
            </ul>
                
        </div>
        <div id="header">
                BASE : <?php echo $base;?>
                <span style="color:#666;float:right;font-size:14px;">
                请注意! 参数表格中透明度低为<附加参数>,复制按钮不带<附加参数></span>
        </div>
        <div id="navigation">
            <div id="title">
                <?php echo $projectName; ?>
                <a   id="helpBtn">(使用说明) API总数{{$count}}</a>
            </div>
            <ul>
                <?php
                    function children($v,$k){
                        $html="";
                        foreach ($v as $key => $vv) {
                             $html.='<li><a href="#'.$vv['apiName'].$k.'">'.$vv['apiName'].'</a></li>';
                        }
                        return $html;
                    }
                    if($arrAll){
                        foreach ($arrAll as $key => $value) {
                            echo '
                                <li>
                                    <a   style="color:#ccc">'.$key.'</a>
                                <ul>
                                     '.children($value,$key).' 
                                </ul>
                            </li>
                            ';
                        }
                    }
                   
                ?>
               
            </ul>
        </div>

        <div id="content">
            
            <div id="left">
                    
            <ul class="apis">
                    <?php 

                    function getParams($params){
                        if(empty($params)) return;
                        $jsonArr=[];
                        foreach ($params as $key => $value) {
                             array_push($jsonArr,$value['name'].":''");
                        }
                        $paramsJson=join(",",$jsonArr);
                        
                        return '{'.$paramsJson.'}';
                    }
                    
                    if($arrAll){
                        foreach ($arrAll as $key => $value) {
                            foreach ($value as $kk => $vv) {
                                if(!empty($vv['methods'])){
                                    echo '
                                    <li>
                                    <h1 id="'.$vv['apiName'].$key.'"> '.$vv['apiName'].'
                                        <span style="color:#999;font-size:16px;">('.$key.')</span>
                                    </h1>
                                    <h2 class="clearfix">
                                        <span class="method '.strtoupper($vv['methods']).'">'.$vv['methods'].'</span>
                                        <span class="url">'.$vv['url'].'</span>
                                        <span class="copy down btn" data-clipboard-text="'.$vv['url'].'">复制</span>
                                    </h2>
                                    <h3>参数 
                                    <span class="copy down btn" data-clipboard-text="'.getParams($vv['params']).'">复制</span>
                                    </h3>
                                    <table class="optable">
                                        <tbody>';
                                        foreach ($vv['plus'] as $kkk => $vvv) {
                                           echo '
                                           <tr>
                                               <td style="opacity:0.2" width="20%">'.$vvv['name'].'</td>
                                               <td style="opacity:0.2" width="30%">
                                                   <input type="text" value="'.$vvv['default'].'">
                                               </td>
                                               <td  style="opacity:0.2" width="25%">
                                               '.$vvv['type'].'
                                               </td>
                                               <td  style="opacity:0.2" width="25%">
                                               '.$vvv['msg'].'
                                               </td>
                                       </tr>';
                                       } 
                                       foreach ($vv['params'] as $kkk => $vvv) {
                                           echo '
                                           <tr>
                                               <td width="20%">'.$vvv['name'].'</td>
                                               <td width="30%">
                                                   <input type="text" value="'.$vvv['default'].'">
                                               </td>
                                               <td  width="25%">
                                               '.$vvv['type'].'
                                               </td>
                                               <td  width="25%">
                                               '.$vvv['msg'].'
                                               </td>
                                       </tr>';
                                       }   
                                     
       
                                        echo '</tbody>
                                    </table>
                                    <h3>响应
                                    <span class="ajax down">请求测试</span>
                                    </h3>
                                    <pre>
                                        <code class="lang-json">';
                                        echo "<p> {</p>";
                                        
                                        foreach ($vv['return'] as $kkk => $vvv) {
                                           echo '<p style="margin-left:20px;">'.$vvv['name'].':"'.$vvv['msg'].'",</p>';
                                           }
                                            echo "<p> }</p>";
                                       
                                        
                                        echo '</code>
                                    </pre>
                                </li>
                                    ';
                                }
                                
                            }    
                        }
                    }
                    ?>
            </ul>

            


           </div>

            <div id="right">
                   <div class="abs">
                   <h4>请求结果不为JSON将显示在右侧</h4>
                   <br>
                   <h5 style="color:#666">地址</h5>
                   <br>
                   <h4 id="ajaxServer">...</h4>
                   <br>
                   <h5 style="color:#666">路径</h5>
                   <br>
                   <h4 id="ajaxUrl">...</h4>
                   <br>
                   <h5 style="color:#666">参数</h5>
                   <br>
                   <pre><code id="ajaxParams">...</code></pre>
                   <br>
                   <h5 style="color:#666">响应</h5>
                   <br>
                   <pre><code id="ajaxRes">...</code></pre>
                   </div>
           
                    
            </div>
            <div id="right2">
                <div style="width:1366px">
                    <iframe width="100%" height="100%" frameborder="0"></iframe>
                </div>
            </div>
       
       </div>

       <script>
            var base="<?php echo $base; ?>";
            // clip
            var clip=new ClipboardJS('.btn');
            clip.on('success',function(){
                toastr.success('复制成功');
            });
            clip.on('error',function(){
                toastr.error('复制失败');
            })

            

            // scroll
            
            var offsetArr=[];
            $(".apis li").each(function(i,v){
                var top=$(v).offset().top;
                offsetArr.push({top:top,bottom:top+$(this).height()});
            });
            $(".apis").scroll(function(){
                var _thisScrollTop=$(this).scrollTop();
                for(var i=0;i<offsetArr.length;i++){
                    var _this=offsetArr[i];
                    if(_thisScrollTop>_this.top&&_thisScrollTop<_this.bottom){
                        var id=$(".apis li").eq(i).children('h1').attr('id');
                        $("#navigation>ul a").removeClass('active');
                        $("[href='#"+id+"']").addClass('active');
                        continue;
                    }
                }
            });

            //ajax
            var dom=$("#right2 iframe")[0].contentDocument;
            $(".ajax").click(function(){
                var p=$(this).parents('li');
                var url=p.children('h2').children('.url').text();
                var method=p.children('h2').children('.method').text();
                var params={};
                p.children('table').children('tbody').children('tr').each(function(i,v){
                    var tds=$(this).children(v);
                    params[tds.eq(0).text()]=tds.eq(1).children('input').val();
                });
                $("#ajaxUrl").html(url);
                $("#ajaxServer").html(base);
                $("#ajaxParams").html(JSON.stringify(params,false,4));
                
                high();
                
                toastr.info('开始请求');
                dom.write("");
                dom.close();

                $.ajax({
                    url:base+url,
                    type:method,
                    data:params,
                    success:function(res){
                        if(typeof(res)=='object'){
                            var html=JSON.stringify(res,false,4);
                            $("#ajaxRes").html(html);
                        }else{
                            var html=res;
                            $("#right2>div").html(html);
                        }
                        high();
                        toastr.success('请求成功');
                    },
                    error:function(res){
                        try{
                            var html=JSON.stringify(res.responseJSON);
                        }catch(err){
                            var html=res.responseJSON;
                        };
                        if(res.responseText){
                            var html=res.responseText;
                        }
                        $("#ajaxRes").html("<h1>ERROR</h1>");
                        dom.write(html);
                        dom.close();
                        toastr.error('请求嗝了,查看右边后端报错信息');
                    }
                });
            });
            
            function high(){
                $("code").each(function(){
                hljs.highlightBlock(this);
                })
            }
            high();

            $("#helpBtn").click(function(){
                $("#black,#help").fadeIn();
                return false;
            })
            $("#black").click(function(){
                $("#black,#help").fadeOut();
            })

       </script>


</body>
</html>